<template>
	<view style="background-color:#f0f0f0;">
		<view class="flexbc padding-all-50">
			<view>
				<view class="userHeadPic" :style="'background-image:url('+userInfo.WxHeadPic+')'"></view>
				<view class="padding-all-20" style="float:left;">
					<text class="fs-30">{{ userInfo.NickName }}</text><br>
					<text class="fs-24" style="color:#999" v-for="(item,index) in userInfo.Roles">
						{{ item.LabelName }}
						<text v-if="index < userInfo.Roles.length-1">，</text>
					</text>
				</view>
			</view>
			<view class="fs-24 line-height-100" style="color:#FF6600;" @click="gotoUrl('/myPages/pages/authinfo')"
				v-if="userInfo.isAuthOk == 0">请先去实名认证</view>
			<view class="fs-24 line-height-100" style="color:#FF0000;" @click="gotoUrl('/myPages/pages/authinfo')"
				v-if="userInfo.isAuthOk == 1">已提交等待审核</view>
			<view class="fs-24 line-height-100" style="color:green;" v-if="userInfo.isAuthOk == 2">
				<image :src="baseUrl + 'icon/authed.png'" style="width:40rpx;height:40rpx;"></image>
				<text style="height:40rpx;line-height:40rpx;">已实名认证</text>
			</view>
			<view class="fs-24 line-height-100" style="color:#FF0000;" @click="gotoUrl('/myPages/pages/authinfo')"
				v-if="userInfo.isAuthOk == 3">未审核通过</view>
			<view class="fs-24 line-height-100" style="color:#FF0000;" @click="gotoUrl('/myPages/pages/authinfo')"
				v-if="userInfo.isAuthOk == 4">已封禁认证</view>
		</view>
		<view style="padding:20rpx;">
			<view class="authBox" @click="personAuth">
				<view class="authPic">
					<image :src="baseUrl + 'icon/person.png'" mode="widthFix"></image>
				</view>
				<view class="authTexts">
					<view class="authTitle">个人身份认证</view>
					<view class="authMemo">适用于模特、摄影师等身份认证</view>
				</view>
				<button class="authBtn">去认证</button>
			</view>
			<view class="authBox">
				<view class="authPic">
					<image :src="baseUrl + 'icon/company.png'" mode="widthFix"></image>
				</view>
				<view class="authTexts">
					<view class="authTitle">企业机构认证</view>
					<view class="authMemo">适用于公司主体认证</view>
				</view>
				<view v-if="Object.keys(MyCompany).length === 0">
					<button class="authBtn" @click="companyAuth">去认证</button>
				</view>
				<view v-else>
					<button class="authBtn" v-if="MyCompany.isAuthOk == 0" @click="companyAuth">去认证</button>
					<button class="authBtn" style="background-color:blue;color:#FFF" v-if="MyCompany.isAuthOk == 1"
						@click="companyAuth">待审核</button>
					<button class="authBtn" style="background-color:green;color:#FFF"
						v-if="MyCompany.isAuthOk == 2">已认证</button>
					<button class="authBtn" style="background-color:blue;color:#FFF" v-if="MyCompany.isAuthOk == -1"
						@click="companyAuth">未通过</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: {},
				MyCompany: {},
				baseUrl: ''
			};
		},
		onShow() {
			this.baseUrl = this.$baseUrl;
			this.getMyInfo()
			this.getMyCompanyInfo()
		},
		methods: {
			gotoUrl(url) {
				this.$common.goNavPage(url)
			},
			getMyInfo() {
				this.$httpost('/UserCenter/myinfo', {}).then(res => {
					// console.log('myinfo', res)
					if (res.code == 200) {
						this.userInfo = res.data.UserInfo
					}
				})
			},
			getMyCompanyInfo() {
				this.$httpost('/UserCenter/myCompanyInfo', {}).then(res => {
					// console.log('myCompanyInfo', res)
					if (res.code == 200) {
						if (res.data !== null) {
							this.MyCompany = res.data
						}
					}
				})
			},
			companyAuth() {
				if (this.userInfo.isAuthOk !== 2) {
					uni.showModal({
						title: '温馨提示',
						content: '完成实名认证后才能申请企业认证',
						confirmText: '去认证',
						success: (res) => {
							if (res.confirm) {
								this.$common.goNavPage('/myPages/pages/companyAuth')
							}
						}
					})
				} else {

					if (this.userInfo.isAuthOk == 4) {
						uni.showModal({
							title: '温馨提示',
							content: '由于您违规操作，平台禁止您再次申请！',
							confirmText: '关闭',
							success: (res) => {}
						})
					} else {
						this.$common.goNavPage('/myPages/pages/companyAuth')
					}

				}

			},
			personAuth() {
				if (this.userInfo.isAuthOk !== 2) {
					uni.showModal({
						title: '温馨提示',
						content: '完成实名认证后才能申请身份认证',
						confirmText: '去认证',
						success: (res) => {
							if (res.confirm) {
								this.$common.goNavPage('/myPages/pages/authinfo')
							}
						}
					})
				} else {
					this.$common.goNavPage('/myPages/pages/personAuth')
				}
			}
		}
	}
</script>

<style lang="scss">
	.file-picker__box-content {
		height: 100%;
	}

	.userHeadPic {
		float: left;
		width: 120rpx;
		height: 120rpx;
		border-radius: 120rpx;
		background-color: #CCC;
		background-image: url('/static/icon/head.png');
		background-size: cover;
		background-position: center;
	}

	.authBox {
		height: 150rpx;
		background-color: #FFF;
		border-radius: 20rpx;
		padding: 20rpx;
		padding-top: 50rpx;
		margin: 10rpx;
		margin-bottom: 30rpx;
	}

	.authPic {
		float: left;
		width: 100rpx;
		height: 100rpx;
		padding-top: 20rpx;
		padding-left: 20rpx;
	}

	.authPic image {
		width: 80%;
		height: 80%;
	}

	.authTexts {
		width: 350rpx;
		float: left;
		margin-left: 20rpx;
		margin-top: 15rpx;
	}

	.authTitle {
		font-size: 32rpx;
		font-weight: bold;
		line-height: 60rpx;
	}

	.authMemo {
		font-size: 24rpx;
		color: #999
	}

	.authBtn {
		float: right;
		background-color: $globalColor;
		font-size: 24rpx;
		color: #000;
		width: 130rpx;
		height: 60rpx;
		line-height: 60rpx;
		// border-radius:30rpx;
		margin-top: 25rpx;
	}

	.line-height-100 {
		line-height: 100rpx;
	}
</style>